<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" >
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title> 招聘网站- 角色列表</title>
    <meta name="keywords" content="">
    <meta name="description" content="">

    <link rel="shortcut icon" href="favicon.ico">
    <link href="css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="css/font-awesome.css?v=4.4.0" rel="stylesheet">

    <!-- Data Tables -->
    <link href="css/plugins/dataTables/dataTables.bootstrap.css"
          rel="stylesheet">
    <link href="css/animate.css" rel="stylesheet">
    <link href="css/style.css?v=4.1.0" rel="stylesheet">

</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>角色列表</h5>
                </div>
                <div class="ibox-content">
                    <div>
                        <a href="/toAddRole" class="btn btn-success">添加角色</a>
                    </div>
                    <table class="table table-striped table-bordered table-hover dataTables-example">
                        <thead>
                        <tr>
                            <th>序号</th>
                            <th>职务名称</th>
                            <th>职务描述</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        <!--以下代码需修改 -->
                        <tr class="gradeA" th:each="role:${roleList}">
                            <td th:text="${role.id}">1</td>
                            <td th:text="${role.roleName}">工程师</td>
                            <td th:text="${role.roleDesc}">设计程序</td>
                            <td><a th:href="@{'/toUpdateRole?id='+${role.id}}" class="btn btn-primary">修改</a>&nbsp;&nbsp;
                                <a th:href="@{${role.id}}" class="ddel1 btn btn-danger">删除</a></td>
                        </tr>
                        <!--以上代码需修改 -->
                        </tbody>
                    </table>

                </div>
            </div>
        </div>
    </div>
</div>
<!--表单中没有编写提交方式，默认是get,如果使用的是Rest方式，那么必须加method="post" -->
<form action="delRole">
    <input type="hidden" name="id"/>
</form>

<!-- 全局js -->
<script src="js/jquery.min.js?v=2.1.4"></script>
<script src="js/bootstrap.min.js?v=3.3.6"></script>
<script src="js/plugins/jeditable/jquery.jeditable.js"></script>

<!-- Data Tables -->
<script src="js/plugins/dataTables/jquery.dataTables.js"></script>
<script src="js/plugins/dataTables/dataTables.bootstrap.js"></script>

<!-- 自定义js -->
<script src="js/content.js?v=1.0.0"></script>
<script type="text/javascript">
    // $(function (){
    //     $(".ddel").click(function (){
    //         var flag=confirm("确认要删除吗?");
    //         if(flag){
    //             var href = $(this).attr("href");
    //             $("[name=id]").val(href);
    //             $("from").attr("action","delRole");
    //             $("from").submit();
    //         }
    //         return;
    //     });
    // });
    $(function () {
        $(".ddel1").click(function () {
            var flag=confirm("确认要删除吗?");
            if(flag){
                var href=$(this).attr("href");//获取超链接的href属性值
                $("[name=id]").val(href);//给表单中的隐藏域赋值
                $("form").attr("action","delRole");//当前的操作这一步可以不写，当提交到不同地址时一定要写
                $("form").submit();//手动提交表单
            }
            return false;
        });
    });
</script>

</body>
</html>